<!--
 * @Author: error: git config user.name && git config user.email & please set dead value or install git
 * @Date: 2022-12-30 15:32:35
 * @LastEditors: 朱安武 549410045@qq.com
 * @LastEditTime: 2023-01-05 22:34:09
 * @FilePath: \html学习\vue-test\elementUi\src\pages\MainPage.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->

<template>
    <div class="common-layout">
        <el-container>
            <el-aside width="200px" >
                <MainAside></MainAside>
            </el-aside>
                <el-container>
                    <el-header class="main-header">
                        <MainHeader></MainHeader>
                    </el-header>
                    <el-main class="main-main">
                        <router-view></router-view>
                    </el-main>
                </el-container>
        </el-container>
    </div>
</template>
<script setup>
import MainAside from '../components/MainAside.vue';
import MainHeader from '../components/MainHeader.vue';

import { onMounted,ref } from 'vue';

let windowHeight = ref(0)
onMounted(() => {
    document.querySelector('.el-aside').style.height =  window.innerHeight + 'px'
    
})
</script>
<style  scoped>
.el-aside{
    background-color: #545c64;
}
</style>